<template>
<div>

  <el-row>
    <el-col :span="4">
      <el-input v-model="stuClass" placeholder="输入班级"></el-input>
    </el-col>
    <el-col :span="4">
      <el-input v-model="stuName" placeholder="输入学生姓名"></el-input>
    </el-col>
    <el-col :span="4">
      <el-input v-model="month" placeholder="考勤月份"></el-input>
    </el-col>
    <el-col :span="4"><el-button type="primary"  @click="findAllStudentsCheckInfoDetails">查询</el-button>
  </el-col>
  </el-row>

  <el-table
      :data="tableData"
      border
      style="width: 100%">
    <el-table-column
        prop="id"
        label="序号"
        width="180">
    </el-table-column>
    <el-table-column
        prop="stuID"
        label="学号"
        width="180">
    </el-table-column>
    <el-table-column
        prop="stuName"
        label="姓名">
    </el-table-column>
    <el-table-column
        prop="stuClass"
        label="班级">
    </el-table-column>
    <el-table-column
        prop="checkDate"
        label="考勤日期">
    </el-table-column>
    <el-table-column
        prop="week"
        label="考勤星期">
    </el-table-column>
    <el-table-column
        prop="checkStatus"
        label="考勤状态">
    </el-table-column>
  </el-table>
<el-divider></el-divider>
  <el-pagination
      @size-change="handleSizeChange"
      @current-change="handleCurrentChange"
      :current-page="pageNum"
      :page-sizes="[2, 5, 10, 20]"
      :page-size="pageSize"
      layout=" prev, pager, next"
      :total="totalCount"
  ></el-pagination>

</div>
</template>

<script>
export default {
  data() {
    return {
      totalCount:5,
      stuName:undefined,
      stuClass:undefined,
      month:undefined,
      pageNum:1,
      pageSize:3,
      curdate:'2023-06-02',
      statusList:[
        {statusId:1,label:'请假一天',value:'请假一天'},
        {statusId:2,label:'迟到',value:'迟到'},
        {statusId:3,label:'早退',value:'早退'},
        {statusId:4,label:'正常',value:'正常'},
        {statusId:5,label:'上午请假',value:'上午请假'},
        {statusId:6,label:'下午请假',value:'下午请假'}
      ],

      tableData: [{
        id: 4,
        stuName: '陈宪',
        stuClass: 'WNSHJ078',
        stuID:'WNWH202301010',
        checkStatus:'下午请假',
        checkDate: '2023-06-02',
        week:'周日'
      }, {
        id: 1,
        stuName: '陈宪1',
        stuClass: 'WNSHJ078',
        stuID:'WNWH202301010',
        checkStatus:'下午请假',
        checkDate: '2023-06-02',
        week:'周日'
      }, {
        id: 2,
        stuName: '陈宪2',
        stuClass: 'WNSHJ078',
        stuID:'WNWH202301010',
        checkStatus:'下午请假',
        checkDate: '2023-06-02',
        week:'周日'
      }, {
        id: 3,
        stuName: '陈宪3',
        stuClass: 'WNSHJ078',
        stuID:'WNWH202301010',
        checkStatus:'下午请假',
        checkDate: '2023-06-02',
        week:'周日'
      }, {
        id: 4,
        stuName: '陈宪4',
        stuClass: 'WNSHJ078',
        stuID:'WNWH202301010',
        checkStatus:'下午请假',
        checkDate: '2023-06-02',
        week:'周日'
      }, {
        id: 5,
        stuName: '陈宪5',
        stuClass: 'WNSHJ078',
        stuID:'WNWH202301010',
        checkStatus:'下午请假',
        checkDate: '2023-06-02',
        week:'周日'
      }]
    };
  },
  methods: {


    handleSizeChange(val) {
      this.pageSize = val;
    },
    handleCurrentChange(val) {
      this.pageNum = val;
      this.findAllStudentsCheckInfoDetails();
    },

    findAllStudentsCheckInfoDetails(){
      this.$axios({
        url:'/findAllStudentsCheckInfoDetails',
        method:'get',
        params:{
          stuName:this.stuName,
          stuClass:this.stuClass,
          month:this.month,
          pageNum:this.pageNum
        }
      }).then(res=>{
        console.log(res)
        this.tableData = res.data.list;
        this.totalCount = res.data.total;
      })
    },
    findAllStudentsCheckInfo(){
      this.$axios({
        url:'/findAllStudentsCheckInfo',
        method:'get'
      }).then(res=>{
        console.log(res)
        this.tableData = res.data;
        // for(let i =0;i<tmp.length;i++){
        //   tmp[i].checkDate=new Date();
        // }
        // this.tableData=tmp
      })
    },
    saveStudentsCheckInfo(){
      this.$axios({
        url:'/saveStudentsCheckInfo',
        method:'post',
        data:this.tableData
      }).then(res=>{
        console.log(res)
        // this.tableData=res.data
      })
    }

  },
  created(){

   this.findAllStudentsCheckInfoDetails();
  }
}
</script>
